<template>
    <MyDialog ref="myDialog"title="审核驳回原因" width="480px" :on-confirm="confirm" :on-cancel="clearData">
        <div class="content-box">
            <el-form :model="formData" :rules="rules" ref="formRef" class="content-box">
                <el-form-item prop="examineContent">
                    <el-input
                        type="textarea"
                        v-model="formData.examineContent"
                        placeholder="请输入说明，不超过100字。" 
                        :rows="5"  
                        :maxlength="100"
                        show-word-limit
                        style="width:400px"
                    ></el-input>
                </el-form-item>
            </el-form>
        </div>
    </MyDialog>
</template>

<script setup lang="ts">
import { ElMessage } from 'element-plus';

interface FormData {
    id: string;
    examineContent?: string;
}

const formRef = ref();

const formData = ref<FormData>({
    id: '',
    examineContent: '',
});

const rules = {
    examineContent: [
    { required: true, message: '请输入驳回原因', trigger: 'blur' },
    { max: 100, message: '不能超过100字', trigger: 'blur' }
  ]
};

const emit = defineEmits<{
    (event: 'completeFailed', value: boolean): void;
}>();

const confirm = async (): Promise<boolean> => {
    try{
        let result = (await formRef.value?.validate()) || false;
        if (result) {
            const params: any = {
                ...formData.value,
                operateType: '0',
            };
            const res: any = await MyService.resource.updateProductReviewExamine(params);
            if (res.code === 200) {
                ElMessage.success({
                    message: '操作成功',
                });
                emit('completeFailed', true);
                return true;
            } else {
                ElMessage.error({
                    message: res.msg || '操作失败',
                });
                emit('completeFailed', false);
                return false;
            }
        } else {
            emit('completeFailed', false);
            return false;
        }
    }catch(error){
        return false;
    }
};

const clearData = () => {
  formRef.value?.resetFields();
  formRef.value?.clearValidate();
};

const myDialog = ref<MyComment.DialogInstance>();

const open = (id: string) => {
    formData.value.id = id;
    myDialog.value?.open();
};

defineExpose({
    open,
});

onBeforeMount(() => {
});

</script>

<style scoped lang="scss">
.content-box {
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

</style>
